// 字体优化工具类
@use '../variables' as *;

/**
 * 中文字体类
 * @description 专门用于中文文本的字体优化
 */

.font-chinese {
    font-family: $font-family-chinese;
    font-display: swap;
}


/**
 * 英文字体类
 * @description 专门用于英文文本的字体优化
 */

.font-english {
    font-family: $font-family-english;
    font-display: swap;
}


/**
 * 数字字体类
 * @description 专门用于数字显示的字体优化
 */

.font-number {
    font-family: $font-family-number;
    font-display: swap;
}


/**
 * 字体渲染优化类
 * @description 提供最佳的字体渲染效果
 */

.font-optimized {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-feature-settings: 'liga' 1, 'kern' 1;
}


/**
 * 字体加载状态类
 * @description 在字体加载期间提供平滑的过渡效果
 */

.font-loading {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

.font-loaded {
    opacity: 1;
}


/**
 * 响应式字体大小类
 * @description 根据屏幕尺寸自动调整字体大小
 */

.font-responsive {
    font-size: clamp(0.875rem, 2vw, 1rem);
    line-height: 1.6;
}


/**
 * 标题字体优化
 * @description 为标题提供特殊的字体优化
 */

.font-heading {
    font-family: $font-family-chinese;
    font-weight: $font-semibold;
    letter-spacing: -0.025em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


/**
 * 正文字体优化
 * @description 为正文内容提供最佳的阅读体验
 */

.font-body {
    font-family: $font-family;
    font-weight: $font-normal;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


/**
 * 代码字体优化
 * @description 为代码块提供等宽字体
 */

.font-mono {
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', 'Source Code Pro', monospace;
    font-size: 0.875em;
    line-height: 1.5;
}


/**
 * 字体权重工具类
 */

.font-light {
    font-weight: $font-light;
}

.font-normal {
    font-weight: $font-normal;
}

.font-medium {
    font-weight: $font-medium;
}

.font-semibold {
    font-weight: $font-semibold;
}

.font-bold {
    font-weight: $font-bold;
}


/**
 * 字体大小工具类
 */

.text-xs {
    font-size: $text-xs;
}

.text-sm {
    font-size: $text-sm;
}

.text-base {
    font-size: $text-base;
}

.text-lg {
    font-size: $text-lg;
}

.text-xl {
    font-size: $text-xl;
}

.text-2xl {
    font-size: $text-2xl;
}

.text-3xl {
    font-size: $text-3xl;
}

.text-4xl {
    font-size: $text-4xl;
}

.text-5xl {
    font-size: $text-5xl;
}


/**
 * 行高工具类
 */

.leading-none {
    line-height: 1;
}

.leading-tight {
    line-height: 1.25;
}

.leading-snug {
    line-height: 1.375;
}

.leading-normal {
    line-height: 1.5;
}

.leading-relaxed {
    line-height: 1.625;
}

.leading-loose {
    line-height: 2;
}


/**
 * 字母间距工具类
 */

.tracking-tighter {
    letter-spacing: -0.05em;
}

.tracking-tight {
    letter-spacing: -0.025em;
}

.tracking-normal {
    letter-spacing: 0;
}

.tracking-wide {
    letter-spacing: 0.025em;
}

.tracking-wider {
    letter-spacing: 0.05em;
}

.tracking-widest {
    letter-spacing: 0.1em;
}


/**
 * 文本对齐工具类
 */

.text-left {
    text-align: left;
}

.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

.text-justify {
    text-align: justify;
}


/**
 * 文本装饰工具类
 */

.underline {
    text-decoration: underline;
}

.no-underline {
    text-decoration: none;
}

.line-through {
    text-decoration: line-through;
}


/**
 * 文本转换工具类
 */

.uppercase {
    text-transform: uppercase;
}

.lowercase {
    text-transform: lowercase;
}

.capitalize {
    text-transform: capitalize;
}

.normal-case {
    text-transform: none;
}


/**
 * 文本溢出处理
 */

.truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.text-ellipsis {
    text-overflow: ellipsis;
}


/**
 * 选择文本样式
 */

.select-none {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.select-text {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

.select-all {
    -webkit-user-select: all;
    -moz-user-select: all;
    -ms-user-select: all;
    user-select: all;
}

.select-auto {
    -webkit-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
}


/**
 * 字体加载动画
 */

@keyframes font-loading {
    0% {
        opacity: 0.8;
    }
    100% {
        opacity: 1;
    }
}

.font-loading-animation {
    animation: font-loading 0.3s ease-in-out;
}


/**
 * 响应式字体断点
 */

@media (max-width: 768px) {
    .font-responsive {
        font-size: clamp(0.75rem, 3vw, 0.875rem);
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .font-responsive {
        font-size: clamp(0.875rem, 2.5vw, 1rem);
    }
}

@media (min-width: 1025px) {
    .font-responsive {
        font-size: clamp(1rem, 2vw, 1.125rem);
    }
}